<style scoped="scoped">
  .title {
    font-weight: 600; font-size: 18px; line-height: 50px;
  }
</style>
<template>
  <Portlet title="线路信息">
    <el-row>
      <el-col :lg="8" :md="12" :xl="6">
        <span class="title">线路起点-揽货</span>
        <el-form label-position="left" label-width="110px">
          <el-row>
            <el-col :span="24">
              <el-form-item label="联系人:">
                <span>{{data.solicitationName}}</span>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="联系电话:">
                <span>{{data.solicitationPhone}}</span>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="地址:">
                <span>{{data.startProvince}} {{data.startCity}} {{data.startDistrict}} {{data.startAddress}}</span>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="覆盖范围:">
                <span>{{data.startCoverageArea}}</span>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </el-col>
      <el-col :lg="8" :md="12" :xl="6">
        <span class="title">线路终点-到件</span>
        <el-form label-position="left" label-width="110px">
          <el-row>
            <el-col :span="24">
              <el-form-item label="联系人:">
                <span>{{data.arrivalName}}</span>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="联系电话:">
                <span>{{data.arrivalPhone}}</span>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="地址:">
                <span>{{data.endProvince}} {{data.endCity}} {{data.endDistrict}} {{data.endAddress}}</span>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="覆盖范围:">
                <span>{{data.endCoverageArea}}</span>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </el-col>
      <el-col :lg="8" :md="12" :xl="6">
        <span class="title">时效及状态</span>
        <el-form label-position="left" label-width="110px">
          <el-row>
            <el-col :span="24">
              <el-form-item label="承诺时效:">
                <span>{{data.aging}} 天</span>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="线路状态:">
                <span>{{data.lineState === 1 ? '运营中' : '已停用'}}</span>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </el-col>
      <el-col :lg="8" :md="12" :xl="6">
        <span class="title">线路价格</span>
        <el-form label-position="left" label-width="110px">
          <el-row>
            <el-col :span="24">
              <el-form-item label="起步价:">
                <span>{{data.startingPrice}}</span>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="轻货单价:">
                <span>{{data.lightPrice}} 元/m³</span>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="重货单价">
                <span>{{data.heavyPrice}} 元/KG</span>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </el-col>
    </el-row>
  </Portlet>
</template>
<script>
import {dotData} from '@/utils'
export default {
  data() {
    return {
      id: this.$route.params.id,
      data: {}
    }
  },
  created() {
    this.getData()
  },
  methods: {
    getData() {
      this.$ajax.get('/ms-warehouse-trunk/line/get-trunk-line', {id: this.id}).then(response => {
        const success = dotData(response, 'success')
        if (success) {
          this.data = dotData(response, 'data') || {}
        }
      })
    }
  }
}
</script>
